//
//  IntroView.swift
//  Speek
//
//  Created by MikeHo on 2023/7/6.
//

import SwiftUI

struct IntroView: View {
    @State private var activeIntro: PageIntro = pageIntros[0]
    @State private var isGoToMainMenu = false
    
    var body: some View {
        NavigationView {
            GeometryReader{
                let size = $0.size
                
                IntroPage(intro: $activeIntro, size: size){
                    VStack(spacing:10){
                        //                        Button {
                        //
                        //                        } label: {
                        NavigationLink(destination: MainMenu()) {
                            Text("Continue")
                                .fontWeight(.semibold)
                                .foregroundColor(.black)
                                .padding(.vertical,15)
                                .frame(maxWidth: .infinity)
                                .background{
                                    Capsule()
                                        .fill(.white)
                                }
                        }
                    }
                    .padding(.top,25)
                }
            }
            .navigationBarHidden(true)  // 隐藏导航栏
            .padding(15)
        }
    }
}

struct IntroView_Previews: PreviewProvider {
    static var previews: some View {
        IntroView()
            .preferredColorScheme(.dark)
    }
}

struct IntroPage<ActionView: View>:View{
    @Binding var intro : PageIntro
    var size : CGSize
    var actionView:ActionView
    
    init(intro: Binding<PageIntro>, size: CGSize, @ViewBuilder actionView: @escaping ()-> ActionView ) {
        self._intro = intro
        self.size = size
        self.actionView = actionView()
    }
    
    //切换动画
    @State private var showView:Bool = false
    @State private var hideWholeView:Bool = false
    
    var body: some View{
        VStack{
            //显示图片
            GeometryReader{
                let size = $0.size
                
                Image(intro.introAssetImage)
                    .resizable()
                    .padding(15)
                    .aspectRatio(contentMode: .fit)
                    .frame(width: size.width,height: size.height)
            }
            .offset(y:showView ? 0 : -size.height / 2)
            .opacity(showView ? 1 : 0)
            
            VStack(alignment: .leading, spacing: 10){
                Text(intro.title)
                    .font(.system(size: 40))
                    .fontWeight(.black)
                
                Text(intro.subTitle)
                    .font(.headline)
                    .foregroundColor(.gray)
                    .padding(.top,15)
                
                if !intro.displayAction{
                    Group{
                        Spacer(minLength: 25)
                        
                        //页面指示符
                        CustomIndicatorView(totalPages: filteredPages.count, currentPages: filteredPages.firstIndex(of: intro) ?? 0)
                            .frame(maxWidth: .infinity)
                        
                        Spacer(minLength: 10)
                        
                        Button {
                            changeIntro()
                        } label: {
                            Text("Next")
                                .fontWeight(.semibold)
                                .foregroundColor(.black)
                                .frame(width: size.width * 0.4)
                                .padding(.vertical,15)
                                .background(){
                                    Capsule()
                                        .fill(.white)
                                }
                        }
                        .frame(maxWidth: .infinity)
                    }
                }else{
                    //最后一页的跳转按钮
                    actionView
                        .offset(y:showView ? 0 : size.height / 2)
                        .opacity(showView ? 1 : 0)
                }
            }
            .frame(alignment: .leading)
            .offset(y:showView ? 0 : size.height / 2)
            .opacity(showView ? 1 : 0)
        }
        .offset(y:hideWholeView ? size.height/2 : 0 )
        .opacity(hideWholeView ? 0 : 1)
        //返回按钮
        .overlay(alignment:.topLeading){
            //第一页隐藏此按钮
            if intro != pageIntros.first{
                Button {
                    changeIntro(true)
                } label: {
                    Image(systemName: "chevron.left")
                        .font(.title2)
                        .fontWeight(.semibold)
                        .foregroundColor(.white)
                        .contentShape(Rectangle())
                }
                .padding(10)
                .offset(y:showView ? 0 : -200)
                .offset(y:hideWholeView ? -200 : 0)

            }
        }
        .onAppear{
            withAnimation(.spring(response: 0.8,dampingFraction: 0.8,blendDuration: 0).delay(0.1)){
                showView = true
            }
        }
    }
    
    var filteredPages:[PageIntro]{
        return pageIntros.filter{!$0.displayAction}
    }
    
    //页面切换：前/后
    func changeIntro(_ isPrevious: Bool = false){
        
        withAnimation(.spring(response: 0.8,dampingFraction: 0.8,blendDuration: 0)){
            hideWholeView = true
        }
        
        DispatchQueue.main.asyncAfter(deadline: .now()+0.5){
            
            //切换页面
            if let index = pageIntros.firstIndex(of: intro),(isPrevious ? index != 0 : index != pageIntros.count - 1 ){
                intro = isPrevious ? pageIntros[index - 1] : pageIntros[index + 1]
            }else{
                
                intro = isPrevious ? pageIntros[pageIntros.count + 1] : pageIntros[pageIntros.count - 1]
            }
            hideWholeView = false
            showView = false
            
            withAnimation(.spring(response: 0.8,dampingFraction: 0.8,blendDuration: 0)){
                showView = true
            }
        }
        
        
    }
    
}
